
<%@page import="dto.MateriaPrimaDTO"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Alta Rodamiento</title>



	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   	<title>Integración de Aplicaciones</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <style type="text/css">
      body {
        padding-top: 60px;
        padding-bottom: 40px;
      }
    </style>
    <link href="css/bootstrap-responsive.css" rel="stylesheet">

	<link rel="shortcut icon" href="http://twitter.github.com/bootstrap/assets/ico/favicon.ico">
    <!-- Fav and touch icons 
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="http://twitter.github.com/bootstrap/assets/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="http://twitter.github.com/bootstrap/assets/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="http://twitter.github.com/bootstrap/assets/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="http://twitter.github.com/bootstrap/assets/ico/apple-touch-icon-57-precomposed.png">
    -->
    
    <script type="text/javascript" src="js/jquery-1.4.2.min.js" ></script>
  </head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </a>
          <a class="brand" href="index.jsp">Proveedor</a>
          <div class="nav-collapse collapse">
            <ul class="nav">
              <li class="active"><a href="AltaRodamiento">Alta de Rodamientos</a></li>
              <li><a href="ListaPrecios">Lista de precios</a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
	<div class="container well">
		<div class="page-header" style="font-size: 24px;">Alta Rodamiento</div>
		<form class="form-horizontal" method="POST" action="AltaRodamiento" name="rodamientoForm">
			<input type="hidden" name="cantidadFilas" id="cantidadFilas"/>
		  <div class="control-group">
		    <label class="control-label" for="inputCodigoRodamiento">Codigo Rodamiento</label>
		    <div class="controls">
		      <input type="text" id="inputCodigoRodamiento" name="inputCodigoRodamiento" placeholder="Codigo Rodamiento">
		    </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="inputCaracteristica">Descripción</label>
		    <div class="controls">
		      <input type="text" id="inputCaracteristica" name="inputCaracteristica" placeholder="Descripción">
		    </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="inputOrigen">Origen</label>
		    <div class="controls">
		      <input type="text" id="inputOrigen" name="inputOrigen" placeholder="Origen">
		    </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="inputMarca">Marca</label>
		    <div class="controls">
		      <input type="text" id="inputMarca" name="inputMarca" placeholder="Marca">
		    </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="inputTipo">Tipo</label>
		    <div class="controls">
		      <input type="text" id="inputTipo" name="inputTipo" placeholder="Tipo">
		    </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="inputCodigoPropietario">Codigo Propietario</label>
		    <div class="controls">
		      <input type="text" id="inputCodigoPropietario" name="inputCodigoPropietario" placeholder="Codigo Propietario">
		    </div>
		  </div>
		  <div class="control-group">
		    <label class="control-label" for="inputPrecio">Precio</label>
		    <div class="controls">
		      <input type="text" id="inputPrecio" name="inputPrecio" placeholder="Precio">
		    </div>
		  </div>
		  <div class="control-group">
		  	<table>
		  	<tr>
		  		<td>
					<table id="tablaParametros"  align="center" >
						<thead>
							<tr align="center">
								<td class="control-label" nowrap="nowrap">Materia Prima</td>
								<td class="control-label" colspan="2" nowrap="nowrap">Cantidad</h3></td>
							</tr>
						</thead>
						<tbody id="bodyParametros" align="center">
							<tr id="1" align="center">
								<td>
									<select id="codMateriaPrima1" name="codMateriaPrima1" class="control-label">
									<option value=""></option>
									<% if(request.getAttribute("listaMateriasPrimas")!=null){ 
								    	  List<MateriaPrimaDTO> listaMateriasPrimas = (List<MateriaPrimaDTO>) request.getAttribute("listaMateriasPrimas");
								      		for (MateriaPrimaDTO materiaPrima: listaMateriasPrimas){%>
								      		<option value="<%=materiaPrima.getCodigo()%>"><%=materiaPrima.getDescripcion()%></option>
								      <% }
								      		} %>
									</select>
								</td>
								<td><input type="text" id="cantidadMateriaPrima1" name="cantidadMateriaPrima1" maxlength="40"/></td>
							</tr>	
						</tbody>
					</table>		  		
		  		</td>
		  	</tr>
		  	<tr>
				<td colspan="2" height="6" align="right"><input class="btn btn-success" type="button" onclick="agregarParametro();" value="Agregar otra materia prima" /></td>
			</tr>
		  	</table>
		  </div>
		  <div class="control-group">
		    <div class="controls">
		      <button type="button"  onclick="guardar();" class="btn">Guardar</button>
		    </div>
		  </div>
		</form>
	</div>
<script>
var fila = jQuery("#1").clone();
function agregarParametro() {
	var newFila = jQuery(fila).clone();
	var idNew = jQuery('#bodyParametros > tr:last').attr("id");
	idNew = Number(idNew) + 1;

	jQuery(newFila).attr("id", idNew);

	jQuery(newFila).find(":input").each(function() {
		jQuery(this).attr("name",(jQuery(this).attr("name").substr(0, (jQuery(this).attr("name").length) - 1)) + idNew);
		jQuery(this).attr("id",(jQuery(this).attr("id").substr(0, (jQuery(this).attr("id").length) - 1)) + idNew);
	});
	jQuery(newFila).find("select").each(function() {
		jQuery(this).attr("name",(jQuery(this).attr("name").substr(0, (jQuery(this).attr("name").length) - 1)) + idNew);
		jQuery(this).attr("id",(jQuery(this).attr("id").substr(0, (jQuery(this).attr("id").length) - 1)) + idNew);
	});
	jQuery(newFila).find(":text").each(function() {
		jQuery(this).val("");
	});
	newFila.append('<td align="center"><input class="btn btn-danger" type="button" value="Eliminar Materia Prima" onclick="eliminarParametro(this);"/></td>');
	jQuery(newFila).appendTo("#tablaParametros > tbody:last");
}

function eliminarParametro(objeto) {
	jQuery(objeto).parent().parent().remove();

}

function guardar(){
	var numero = jQuery('#bodyParametros > tr:last').attr("id");
	jQuery("#cantidadFilas").val(numero);
	document.rodamientoForm.submit();
}
</script>
</body>
</html>